﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RemoveTableRelation.aspx.cs" Inherits="ReportsFactory.RemoveTableRelation" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Relations</title>
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <link href="Styles/Site.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript" language="javascript">
        var clonedListRemRel;
        var colNames;

        function btnOK_Click()
        {
            window.returnValue = colNames;
            window.close();
        }

        function btnCancel_Click()
        {
            window.returnValue = null;
            window.close();
        }

        function RemoveRel(row)
        {
            if (confirm('Are you sure you want to remove this relation?'))
            {
                colNames.splice(row, 1);
                $('#relTable').children('tr:not(:first)').remove();
                LoadRelationList();
            }
        }

        function ResetRelations()
        {
            $('#relTable').children('tr:not(:first)').remove();
            colNames = clonedListRemRel.slice();
            LoadRelationList();
        }

        function LoadRelationList()
        {
            for (var x = 0; x < colNames.length; x++)
            {
                $('#relTable > tbody:last').after('<tr><td class="tableCell">' + colNames[x].srcCol
                                                + '</td><td class="tableCell">' + colNames[x].tgtTab
                                                + '</td><td class="tableCell">' + colNames[x].tgtCol
                                                + '</td><td class="tableCell" style="text-align: center"><input class="btn" type="button" onclick="RemoveRel(' + x + ')" value="Remove"></td>' 
                                                + '</tr>');

                $('#lblSourceTableName').text(colNames[x].srcTab);
            }
        }

        function LoadData()
        {
            colNames = window.dialogArguments;
            clonedListRemRel = colNames.slice();
        }
    </script>

    <style type="text/css">
        .tableCell
        {
              border-bottom: 1px solid Gray;
              border-right: 1px solid Gray;
              padding: 3px
        }
    
    </style>


</head>
<body onload="javascript:LoadData();LoadRelationList();">
    <form id="form1" runat="server">
    <div>
        <h3>
            Source Table:
            <asp:Label ID="lblSourceTableName" runat="server" />
        </h3>
        <table id="relTable" width="100%" cellpadding="0" cellspacing="0">
            <tfoot>
                <tr>
                    <td colspan="4" width="100%">
                        &nbsp;
                    </td>
                </tr>
                <tr>
                    <td align="center" colspan="4" width="100%">
                        <input id="btnOK" class="btn" type="button" value="OK" onclick="javascript:btnOK_Click();" />
                        &nbsp;
                        <input id="btnCancelCC" class="btn" type="button" value="Cancel" onclick="javascript:btnCancel_Click();" />
                        &nbsp;
                        <input id="btnReset" class="btn" type="button" value="Reset" onclick="javascript:ResetRelations();" />
                    </td>
                </tr>
                <tr>
                    <td colspan="4" width="100%">
                        &nbsp;
                    </td>
                </tr>
            </tfoot>
            <tbody>
                <tr style="border: solid 1px black">
                    <td class="tableCell" width="30%" style="border-top: solid 1px Gray">
                        <b>Source Column</b>
                    </td>
                    <td class="tableCell" width="30%" style="border-top: solid 1px Gray">
                        <b>Target Table</b>
                    </td>
                    <td class="tableCell" width="30%" style="border-top: solid 1px Gray">
                        <b>Target Column</b>
                    </td>
                    <td class="tableCell" width="10%" style="border-top: solid 1px Gray">
                        &nbsp;
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    </form>
</body>
</html>
